<template>
  <section class="editAddTime">
    <el-dialog
      v-dialogDrag
      :visible.sync="curPopupsVisible"
      :title="textMap[popupsState]"
      :append-to-body="true"
      width="70%"
      :close-on-click-modal="false"
      @close="closeEdit"
    >
      <dialogHeader
        slot="title"
        :title="textMap[popupsState]"
        :style-type="$store.state.app.dialogType"
      />

      <div class="app-container app-container-table">
        <one-table-template
          ref="multipleTable"
          :key="oneTableKey"
          :dynamic-buttons="tableButtons"
          :dynamic-components="tableComponents"
          :dynamic-form-fields="formField"
          :dynamic-is-show-select="false"
          :dynamic-is-show-more-btn="true"
          :dynamic-is-init-table="true"
        />
      </div>
    </el-dialog>
  </section>
</template>
<script>
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import api from '@/api/pa/sparepartsDeliveryManagement'
import apis from '@/api/se/electronicarchives'

export default {
  components: {
    dialogHeader: () => import('@/components/dialogHeader'),
    OneTableTemplate
  },

  // 组件混入对象
  mixins: [oneTableWithViewTemplateMixins],

  props: {
    popupsVisible: { type: Boolean, default: false },
    // 从网格传入的编辑行数据(json)
    dynamicEditRowData: { type: Object, default: function() { return {} } }
  },

  data() {
    const viewPageCode = 'FinancialMonthlyMaintenance-edit'

    return {
      // 动态组件-按钮
      tableButtons: [
        {
          compKey: 'btnKey1',
          type: 'primary',
          size: 'small',
          icon: 'iconfont  icon-preservation',
          clickEvent: () => this.save(),
          text: this.$t('sys.button.save') /* 保存*/,
          position: 'right'
        },
        {
          compKey: 'btnKey2',
          size: 'small',
          icon: 'iconfont  icon-cancel',
          clickEvent: () => this.closeEdit(1),
          text: this.$t('sys.button.cancel') // 取消
        }
      ],

      // 动态组件-查询条件
      tableComponents: [
        {
          compKey: 'compKey1',
          labelName: '发货仓库：',
          codeField: 'warehouseId',
          component: () => import('@/components/org/commonSelect'),
          oFields: 'warehouseId,warehouseName',
          customObj: {
            api: api.findWarehouseInfo,
            selectTye: '1'
          },
          isRequire: true,
          isMul: false,
          isMust: true,
          span: 8
        },
        {
          compKey: 'compKey2',
          labelName: '收货地类型：',
          codeField: 'receiptType',
          disabled: true,
          component: () => import('@/components/org/LookupValue'),
          oFields: 'receiptType,receiptTypeCn',
          options: [
            { receiptType: '1', receiptTypeCn: '网点' },
            { receiptType: '2', receiptTypeCn: '分库' }
          ],
          isRequire: true,
          type: 'dropdownList',
          isMul: false,
          isMust: true,
          span: 8
        },
        {
          compKey: 'compKey3',
          labelName: '收货地：',
          codeField: 'dlrId',
          textField: 'dlrFullName',
          component: () => import('@/views/ve/planReport/components/multipleSearchInput'),
          isMul: false,
          isRequire: true,
          isMust: true,
          dataToObject: {
            oFields: 'dlrId,dlrShortName',
            // 控制弹窗页面 搜索 网格 元素
            tableComponents: [
              {
                compKey: 'compKey1',
                labelName: '门店编码：',
                codeField: 'dlrCode',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: true,
                span: 8
              },
              {
                compKey: 'compKey2',
                labelName: '门店名称：',
                codeField: 'dlrFullName',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: true,
                span: 8
              }
            ],
            tableCols: [
              {
                prop: 'dlrCode',
                label: '门店编码'
              },
              {
                prop: 'dlrShortName',
                label: '门店名称'
              }
            ],
            formField: {
              dlrId: '',
              dlrCode: '',
              dlrFullName: ''
            },
            returnField: {
              prop: 'dlrShortName',
              label: '门店名称'
            },
            // api: apis.queryStore
            api: {
              APIUrl: '/mp/e3sh/spareparts/finance/bonusOrderMakeService/queryOrgDlrCodes.do'
            }
          },
          span: 8
        },
        {
          compKey: 'compKey4',
          labelName: '运输方式：',
          codeField: 'transportModeId',
          textField: 'transportModeName',
          component: () => import('@/components/org/commonSelect'),
          oFields: 'transportModeId,transportModeName',
          isRequire: true,
          customObj: {
            api: api.findTransportMode,
            selectTye: '1'
          },
          isMul: false,
          isMust: true,
          span: 8
        },
        {
          compKey: 'compKey5',
          labelName: '运输时间(小时)：',
          codeField: 'transportTime',
          // labelWidth: 90,
          // dataToObject: {
          //   maxWordCount: 6
          // },
          component: () => import('@/components/org/commonInput'),
          isRequire: true,
          isInput: true,
          validrule: {
            isformat: /^([1-9]\d{0,10}|[1-9][0-9]{0,10}\.\d{1,2}|0\.\d{1,2}?|0)$/,
            resectMessage: {
              isformat: '请输入正确的时间！'
            }
          },
          span: 8,
          isMul: false,
          isMust: true
        },
        {
          compKey: 'compKey6',
          labelName: '备货周期(月)：',
          codeField: 'stockingCycle',
          component: () => import('@/components/org/commonInput'),
          isInput: true,
          isRequire: true,
          span: 8,
          validrule: {
            isformat: /^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/,
            resectMessage: {
              isformat: '请输入正确的月份！'
            }
          },
          isMul: false,
          isMust: true
        }
      ],

      // 标题
      textMap: {
        add: '新增物流时间'
      },

      // 表单数据（无需赋值，由混入对象赋值）
      formField: this.$utils.getFormField(this, {
        transportModeId: '',
        transportTime: '',
        stockingCycle: '',
        receiptType: '1',
        // dlrCode: '',
        dlrId: '',
        dlrFullName: '',
        warehouseId: ''
      }, this.$ConfigCache.CacheConfig.cacheData[viewPageCode])
    }
  },

  methods: {
    // 保存
    save() {
      const that = this
      this.$utils.validataMoth(this, 'validpage')
      if (this.valid) {
        const queryObj = {
        // 保存mutation
          type: 'mutation',
          // api配置
          apiConfig: api.savePartLogisticsTimeSet,
          // 条件/实体参数（变量），根据typeParam中的定义配置
          variables: that.formField
        }
        // 转换了中台请求格式数据
        var paramD = this.$getParams(queryObj)
        // 调用中台API方法（可复用）
        this.$requestAPI(paramD).then(response => {
          if (response.result === '1') {
            this.$message({
              message: response.msg,
              type: 'success',
              duration: 1000
            })
            this.$emit('update:popupsVisible', false)
            this.$parent.queryTable(1)
          } else {
            this.$message({
              message: response.msg,
              type: 'warn',
              duration: 1000
            })
          }
        })
      }
    },

    closeEdit() {
      this.$emit('update:popupsVisible', false)
    }
  }
}
</script>

